//// 中部导航 固定
// 获取导航栏和 Banner 的元素
const navbar = document.getElementById("yrys-navbar");
const banner = document.getElementById("yrys-banner-first");
// 获取 Banner 的高度
let bannerHeight = banner.offsetHeight;
const proImgCardList = document.getElementById("pro-img-card-list");
//console.log("pro img card list: "+ proImgCardList);
if(proImgCardList != null){
  bannerHeight = bannerHeight + 40;
}
// 获取所有菜单项和内容区块
const menuItems = document.querySelectorAll(".navbar-wrap a");
const sections = document.querySelectorAll(".product-display-section");

if(navbar != null && menuItems != null){
    // 监听滚动事件
    window.onscroll = function() {
        let currentSection = "";
        
        if (window.scrollY > bannerHeight) {
            navbar.classList.add("fixed");
        } else {
            navbar.classList.remove("fixed");
        }

        // 检查页面滚动位置，找到在视口中的内容区域
        sections.forEach(section => {
            const sectionTop = section.offsetTop - 70; // 偏移量，确保滚动到中心附近
            if (window.scrollY >= sectionTop) {
                currentSection = section.getAttribute("id");
            }
        });

        // 更新菜单项的活动状态
        menuItems.forEach(menu => {
            menu.classList.remove("active");
            if (menu.getAttribute("href") === "#" + currentSection) {
                menu.classList.add("active");

                const targetMenuItem = menu;
                const menuOffset = targetMenuItem.offsetLeft; // 获取目标菜单项的水平位置
                navbar.scrollTo({
                left: menuOffset-10, // 滚动到该菜单项
                behavior: 'smooth' // 平滑滚动
                });
            }
        });
    };
}

// 获取所有FAQ项
const faqItems = document.querySelectorAll(".faq-item .faq-title");
faqItems.forEach(faqTitle => {
    faqTitle.onclick = function() {
        var nextElement = faqTitle.nextElementSibling;
        if(nextElement.classList.contains('active')){
            nextElement.classList.remove('active');
        }else {
            nextElement.classList.add('active');
        }
    };
});

// 获取所有special sale First 变体项
const specialVariantItems = document.querySelectorAll(".product-options .label-item-first");
specialVariantItems.forEach(vairantItem => {
    vairantItem.onclick = function() {
        //所有同级节点 移除 active
        document.querySelector(".label-item-first.active").classList.remove('active');

        //当前节点 加入 active
        if(!vairantItem.classList.contains('active')){
            vairantItem.classList.add('active');
        }

        //价格变化
        let variantPrice = vairantItem.getAttribute("data-price");
        let variantOldPrice = vairantItem.getAttribute("data-old-price");
        var priceContent = variantPrice + '<span class="old-price">' + variantOldPrice + '</span>';
        document.querySelector(".special-first-price").innerHTML = priceContent;

        //差价信息变化        
        var count_off = parseFloat(variantOldPrice.replace(/[^\d\.]/g,'')) - parseFloat(variantPrice.replace(/[^\d\.]/g,''));
        count_off = count_off<0?0:Math.round(count_off);
        var countOffStr = variantPrice.charAt(0)+count_off+' OFF';
        document.querySelector(".special-image-first").parentElement.previousElementSibling.innerHTML = countOffStr;

        //图片变化
        if(vairantItem.getAttribute("data-image-url") != ""){
            document.querySelector(".special-image-first").setAttribute("src",vairantItem.getAttribute("data-image-url"));
        }
    };
});

//special sale first BuyNow
function buySpecialFirst(){
    var choosenItem = document.querySelector(".label-item-first.active");
    var choosenItemId = choosenItem.getAttribute("data-id");
    window.location.href = '/cart/'+choosenItemId+':1';
}

// 获取所有special sale Second 变体项
const secondVariantItems = document.querySelectorAll(".product-options .label-item-second");
secondVariantItems.forEach(vairantItem => {
    vairantItem.onclick = function() {
        //所有同级节点 移除 active
        document.querySelector(".label-item-second.active").classList.remove('active');

        //当前节点 加入 active
        if(!vairantItem.classList.contains('active')){
            vairantItem.classList.add('active');
        }

        //价格变化
        let variantPrice = vairantItem.getAttribute("data-price");
        let variantOldPrice = vairantItem.getAttribute("data-old-price");
        var priceContent = variantPrice + '<span class="old-price">' + variantOldPrice + '</span>';
        document.querySelector(".special-second-price").innerHTML = priceContent;

        //差价信息变化        
        var count_off = parseFloat(variantOldPrice.replace(/[^\d\.]/g,'')) - parseFloat(variantPrice.replace(/[^\d\.]/g,''));
        count_off = count_off<0?0:Math.round(count_off);
        var countOffStr = variantPrice.charAt(0)+count_off+' OFF';
        document.querySelector(".special-image-second").parentElement.previousElementSibling.innerHTML = countOffStr;

        //图片变化
        if(vairantItem.getAttribute("data-image-url") != ""){
            document.querySelector(".special-image-second").setAttribute("src",vairantItem.getAttribute("data-image-url"));
        }
    };
});

//special sale first BuyNow
function buySpecialSecond(){
    var choosenItem = document.querySelector(".label-item-second.active");
    var choosenItemId = choosenItem.getAttribute("data-id");
    window.location.href = '/cart/'+choosenItemId+':1';
}

//选中变体
function productSelectChange(ele) {
    console.log("changed.");
    var selectedOption = ele.options[ele.selectedIndex];
    
    //价格变化
    let optionPrice = selectedOption.getAttribute("data-price");
    let optionOldPrice = selectedOption.getAttribute("data-old-price");
    var priceContent = optionPrice;
    if(optionOldPrice>0){
        priceContent = optionPrice + '<span class="old-price">' + optionOldPrice + '</span>';
    }
    var nextPriceElement = ele.nextElementSibling;
    nextPriceElement.innerHTML = priceContent;

    //差价信息变化        
    var count_off = parseFloat(optionOldPrice.replace(/[^\d\.]/g,'')) - parseFloat(optionPrice.replace(/[^\d\.]/g,''));
    count_off = count_off<0?0:Math.round(count_off);
    var countOffStr = optionPrice.charAt(0)+count_off;
    ele.parentElement.previousElementSibling.previousElementSibling.innerHtml = countOffStr;

    //图片变化
    if(selectedOption.getAttribute("data-image-url") != ""){
        var imgEle = ele.parentElement.previousElementSibling;
        imgEle.setAttribute("src",selectedOption.getAttribute("data-image-url"));
    }

    //选中
    selectedOption.setAttribute("selected",true);
}

//
function productSelectChangeAcc(ele) {
    console.log("Accessories changed.");
    var selectedOption = ele.options[ele.selectedIndex];
    
    //价格变化
    let optionPrice = selectedOption.getAttribute("data-price");
    let optionOldPrice = selectedOption.getAttribute("data-old-price");
    var priceContent = optionPrice;
    if(optionOldPrice>0){
        priceContent = optionPrice + '<span class="old-price">' + optionOldPrice + '</span>';
    }
    var nextPriceElement = ele.nextElementSibling;
    nextPriceElement.innerHTML = priceContent;

    //优惠价百分比变化
    let oldPriceFloat = parseFloat(optionOldPrice.replace(/[^\d\.]/g,''));
    let optionPriceFloat = parseFloat(optionPrice.replace(/[^\d\.]/g,''))
    var count_off = oldPriceFloat - optionPriceFloat;
    count_off = count_off<0?0:Math.round(count_off/oldPriceFloat * 100);
    var countOffStr = count_off + '%';
    ele.parentElement.previousElementSibling.previousElementSibling.innerHtml = countOffStr;

    //图片变化
    if(selectedOption.getAttribute("data-image-url") != ""){
        var imgEle = ele.parentElement.previousElementSibling;
        imgEle.setAttribute("src",selectedOption.getAttribute("data-image-url"));
    }

    //选中
    selectedOption.setAttribute("selected",true);
}

//立即 购买
function buyNowProductItem(ele) {
    var allChildren = ele.parentElement.previousElementSibling.children;
    var productSelectEle = allChildren[allChildren.length-2];
    var selectedOption = productSelectEle.options[productSelectEle.selectedIndex];
    var choosenItemId = selectedOption.getAttribute("data-id");
    window.location.href = '/cart/'+choosenItemId+':1';
}